Install Sileo ^0.1.5 for toast notifications across user actions,
   admin operations, errors, and future watch party features.

Sileo style overrides matching HSL-parametric design system:
- Solid card treatment (hsl(var(--b5)) background, inset shadow border)
- Variant colors (success=accent, error=danger, warning=warning, info=muted)
- Typography (Geist, weight 480/650, size 13px/14px)
- Theme-aware via HSL variables (auto-adapts to dark/light/oled/darker)
- Responsive (90vw mobile, 450px desktop max-width)
- z-index 45 (between player 40 and modals 50)
- Reduced motion support

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add toast.css import after Tailwind to apply Sileo overrides globally.
Import order ensures toast styles load before custom utilities.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add Sileo Toaster component to App.tsx with:
- Position: top-center (centralized, consistent expectations)
- Global availability (inside ErrorBoundary, after Routes)

Toasts now available via sileo.success/error/warning/info/action/promise
throughout the application.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Comprehensive example functions demonstrating context-aware timing:
- Quick actions (3s): like, copy, add to playlist
- Admin operations (4s): ban user, upload set, create invite
- Errors (7s): validation, network, save failures
- Notifications (8s): new sets, comments, watch party events
- Critical (manual): session expired, maintenance warnings
- Interactive: undo delete, view comment with action buttons
- Promise-based: upload/save progress with loading states

All examples follow spec timing guidelines and include descriptions
where appropriate for enhanced context.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Integrate Sileo toasts with LikeButton for user feedback:
- Success: 'Liked!' on like action (3s quick feedback)
- Success: 'Removed from liked songs' on unlike (3s)
- Error: 'Failed to update like status' on API error (7s)

Optimistic UI update with rollback on error, toast provides
confirmation without disrupting playback or browsing flow.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

The Toaster component in App.tsx now respects the user's theme preference from settings.
Maps Zephyron theme names to Sileo's theme values:
- dark/darker/oled → 'dark' theme
- light → 'light' theme

Toasts now update immediately when switching themes in Settings without requiring a page refresh.

Toasts were appearing in light mode regardless of selected theme (OLED, darker, etc.) because Sileo uses SVG rect elements with fill attributes that CSS background properties cannot override.

Solution: compute fill color dynamically from CSS --b5 variable using getComputedStyle and pass to Sileo's options.fill prop. This ensures toasts match the current theme (OLED=true black, darker=6% lightness, dark=14%, light=94%).

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Add bio TEXT column (max 160 chars in app logic)
- Add avatar_url TEXT for R2 avatar URLs
- Add is_profile_public INTEGER for privacy controls (default private)
- Add index for efficient public profile queries

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Update User interface: add avatar_url, bio, is_profile_public
- Add PublicUser interface for public profile views
- Add API request/response types for profile endpoints
- Mark reputation fields as deprecated (to be removed in Phase 3)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Add AVATARS R2 bucket binding (zephyron-avatars)
- Bucket will store user profile pictures as WebP files
- Naming convention: {userId}-{timestamp}.webp

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- POST /api/profile/avatar/upload
- Validates file type (image/*) and size (max 10MB)
- Uploads to R2 AVATARS bucket as WebP
- Saves avatar_url to user table
- Returns new avatar URL on success
- Includes error handling for all validation failures

Phase 1 note: Server-side image resizing deferred to Phase 2
Client handles preview/crop for now

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Remove errorResponse from profile.ts imports (unused, breaks build)
- Remove avatar_url from migration 0019 (already exists in 0001)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- PATCH /api/profile/settings
- Supports updating name, bio, is_profile_public
- Validates display name: 3-50 chars, alphanumeric + spaces + punctuation
- Validates bio: max 160 chars, strips HTML
- Checks display name uniqueness (case-insensitive)
- Returns updated user object on success

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Use Better Auth API for name updates (maintains session consistency)
- Add input trimming for display name field
- Replace typed errors with errorResponse() helper (project convention)
- Convert is_profile_public from INTEGER to boolean in response
- Use 409 status code for name conflicts (not 400)

Addresses code quality review feedback for Task 5.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- GET /api/profile/:userId
- Returns public profile data when is_profile_public = 1
- Returns PROFILE_PRIVATE error when private
- Excludes email for privacy
- Full implementation (stats, activity) coming in Phase 3

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Add nanoid format validation for user IDs
- Use explicit integer comparison for is_profile_public check
- Document index utilization for future maintainers

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- uploadAvatar: uploads profile picture to backend
- updateProfileSettings: updates display name, bio, privacy
- getPublicProfile: fetches public profile data
- All functions include error handling and type safety

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Backend expects 'file' field, not 'avatar'. This fix ensures
avatar uploads work correctly with the backend endpoint.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Frontend type now matches backend contract. The role field is
returned by GET /api/profile/:userId and should be accessible
in components.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Modal dialog with drag-drop and file browser
- Live preview of selected image
- File validation: type (image/*) and size (max 10MB)
- Upload progress indicator
- Toast notifications for success/error
- Closes modal and triggers callback on success

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Add Escape key handling to close modal
- Add body scroll lock while modal is open
- Add ARIA attributes (role, aria-modal, aria-labelledby)
- Make drop zone keyboard accessible (tab + Enter/Space)
- Fix progress interval cleanup on component unmount
- Fix drag state flickering on child hover
- All changes improve WCAG 2.1 AA compliance

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Inline text input with character counter (160 max)
- Auto-save on blur (debounced, silent)
- Counter turns red when over limit
- Reverts to previous value on error
- Shows saving indicator during update

Also fixes:
- ProfilePictureUpload: correct sileo import and interval type
- worker/routes/profile: remove unused UpdateProfileSettingsError import

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Displays avatar (image or fallback initial)
- Shows display name, bio (truncated), role badge
- Avatar is clickable when viewing own profile
- Edit Profile button (only on own profile)
- Responsive sizing (80px mobile, 96px desktop)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Remove tier calculation logic
- Remove tier badge and reputation points from header
- Replace stats: show Playlists, Liked Songs, Sets Listened
- Remove reputation guide card (earning rules, progress bar)
- Clean profile focused on listening activity

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Replace header card with ProfileHeader component
- Add TabBar with 4 tabs: Overview, Activity, Playlists, About
- Overview: stats grid + recent activity placeholder
- Activity: placeholder for Phase 3
- Playlists: placeholder with count
- About: role and joined date
- Avatar upload modal integration
- Remove sidebar (migrated to Settings)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Profile picture: avatar preview + change button + upload modal
- Display name: inline editor with validation
- Bio: inline editor with character counter + auto-save
- Privacy: toggle for public profile visibility
- All sections integrated with profile components
- Optimistic UI with error rollback

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Triggers on push to master branch
- Reads version from package.json
- Extracts changelog section from CHANGELOG.md
- Creates Git tag (v{version})
- Creates GitHub Release with changelog content
- Marks as pre-release for alpha/beta/rc versions
- Skips if release already exists

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Creates releases for all versions in CHANGELOG.md that don't have
GitHub releases yet. Finds commits by version tag in commit message,
extracts changelog content, creates tags and releases.

Features:
- Dry-run mode to preview changes
- Skips existing tags/releases
- Auto-detects pre-release versions (alpha/beta/rc)
- Uses gh CLI for release creation

Usage:
  ./scripts/backfill-releases.sh --dry-run  # Preview
  ./scripts/backfill-releases.sh            # Execute

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Better Auth generates 32-character IDs, not 12-character nanoids.
Updated validation from {12} to {8,64} in all profile endpoints.

Fixes INVALID_USER_ID error on stats, badges, activity endpoints.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Added getOptionalAuth helper for optional authentication.
Updated stats, badges, and activity endpoints to allow access when:
- Profile is public (existing behavior), OR
- Authenticated user is viewing their own profile (new)

Fixes 403 PROFILE_PRIVATE error when users view their own stats/badges.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Only show "Your 2026 Wrapped" card in December or later to avoid
showing year-end stats when the year is still in progress

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add skeleton loading states for all data-fetching components:
- ProfileStatsSkeleton for stats grid, top artists, and heatmap
- BadgesGridSkeleton for achievement badges display
- ActivityFeedSkeleton for activity feed items
- PlaylistGridSkeleton for playlist cards
- SearchResultSkeleton for search results with artists and sets
- ArtistBannerSkeleton for artist page headers
- SetBannerSkeleton for set page headers
- HistoryListSkeleton for listening history
- ArtistGridSkeleton for artist grids
- EventGridSkeleton for event listings

Updated components and pages to use new skeletons instead of
generic loading text:
- ProfileStatsSection, BadgesGrid, ActivityFeed
- ArtistPage, SetPage, SearchPage, PlaylistsPage, HistoryPage

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Migrate artist profile images from external API fetches to Cloudflare R2
bucket storage with new dedicated endpoint.

Backend:
- Add GET /api/artists/:id/image endpoint to serve images from R2
- Images stored at R2 key: artists/{id}/image.jpg
- Cache headers: 86400s max-age, public, CORS enabled
- Fallback to 404 if artist or image not found

Frontend:
- Add getArtistImageUrl() helper function
- Update ArtistPage to use R2 endpoint for banner and profile
- Update ArtistsPage to use R2 endpoint for thumbnails
- Update SetPage artist info to use R2 endpoint
- Update EventPage lineup to use R2 endpoint
- Update admin ArtistsTab display to use R2 endpoint
- Keep image_url field editable in admin for legacy URLs

All artist images now served from R2 with consistent caching and
performance characteristics. Backend image_url field retained for
backward compatibility and admin flexibility.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add professional logo and multi-size favicon assets to replace
placeholder SVG icon.

Assets:
- Logo: /logo-128.png, /logo.svg
- Favicons: 16x16, 32x32, 180x180, 192x192, 512x512
- Apple touch icon: 180x180

Updates:
- Replace SVG play-circle icon with actual logo in navigation
- Add proper favicon links in index.html
- Update Header, PlayerBar, Sidebar, TopNav components
- Update all landing/auth pages (Landing, About, Login, Register, Privacy, Terms)
- Remove placeholder vite.svg

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add comprehensive skill summaries to CLAUDE.md for better AI assistance:
- Accessibility, adapt, animate, arrange, audit skills
- Better Auth integration and security best practices
- Cloudflare platform comprehensive coverage
- Frontend design, React performance, TypeScript patterns
- Vite, Vitest, web performance
- Workers best practices and Wrangler CLI

Approach guidelines added for code style consistency.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Remove image_url field from admin artist edit modal since profile
images are now served from R2 storage. Artists should upload images
directly to R2 bucket at artists/{id}/image.jpg instead of using
external URLs.

Changes:
- Remove imageUrl state and input field
- Remove image preview section
- Remove image_url from enrichment logic
- Remove image_url from save payload
- Update enrichment description text

Images are now managed independently through R2 upload process.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add automated migration script and comprehensive guide for uploading
existing artist images from external URLs to R2 storage.

Files:
- scripts/migrate-artist-images.ts: Automated bulk migration script
  - Fetches artists with image_url from D1
  - Downloads images from external URLs
  - Uploads to R2 at artists/{id}/image.jpg
  - Supports dry-run, limit, and single-artist modes
  - Rate-limited with progress tracking

- scripts/MIGRATION_GUIDE.md: Complete migration documentation
  - Automated script usage instructions
  - Manual wrangler upload alternative
  - Admin UI upload feature implementation example
  - Environment setup and API credential guide
  - Troubleshooting section

Script requires: @aws-sdk/client-s3, Cloudflare API credentials

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Automatically fetch and upload artist profile images to R2 when
enriching from 1001Tracklists HTML in admin panel.

Backend:
- Add POST /api/admin/artists/:id/image endpoint
- Downloads image from provided URL
- Uploads to R2 at artists/{id}/image.jpg
- Returns success/error with R2 key

Frontend:
- Add uploadArtistImageAdmin() API function
- Update enrichment handler to be async
- Auto-upload image when parsing 1001TL HTML
- Show loading state during image upload
- Update success message to mention image upload
- Apply to both edit and import artist modals

Now when pasting 1001Tracklists HTML:
1. Parse all artist data (social links, bio, etc.)
2. Download profile image from 1001TL
3. Upload to R2 automatically
4. Image shows immediately on artist pages

Image upload failures are logged but don't block enrichment.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Update artist image migration script to automatically load credentials
from .env file instead of requiring manual export commands.

Changes:
- Add .env file detection and loading at script start
- Import path utilities for cross-platform .env resolution
- Better error messages showing which variables are missing
- Create .env.example template with all required variables
- Update MIGRATION_GUIDE.md with .env setup instructions

Usage is now simpler:
1. Add Cloudflare credentials to project root .env
2. Run: bun run scripts/migrate-artist-images.ts

The script validates all required variables and shows helpful error
messages if any are missing from .env.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Remove "Activity feed coming in Phase 3" placeholder and show actual
recent activity on profile overview tab.

Changes:
- Replace placeholder card with ActivityFeed component
- Show 3 most recent activity items as preview
- Add "View all →" button that switches to activity tab
- Use feed="me" to show current user's activity

The activity feature was already implemented but the placeholder was
never removed. Now users can see their recent activity directly on
the overview tab, with a link to view the full activity feed.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Enable file watching polling for WSL2 environments where native file
watching doesn't work across Windows-Linux filesystem boundary.

Changes:
- Add server.watch.usePolling: true
- Set polling interval to 300ms
- Enable HMR error overlay

This fixes hot reload not working when project is located on Windows
filesystem (/mnt/e/) and accessed from WSL2.

Alternative solution: Move project to Linux filesystem (~/projects/)
for better performance without polling overhead.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

- Remove unused React imports from components (React 17+ JSX transform)
- Add Env interface with all required Cloudflare bindings
- Fix property name mismatches: cover_art_r2_key → cover_image_r2_key
- Add artist_id to Discord API query results
- Fix ctx → _ctx and artistId references in admin-beta.ts
- Add RESIZE_FAILED to UploadAvatarError union type
- Prefix unused parameters with underscore

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Add comprehensive CI/CD workflows for production:

**Type Checking**
- Runs on all main branches (master, staging, develop)
- Checks both frontend and worker TypeScript

**Testing**
- Runs tests on push and PR
- Uploads coverage to Codecov

**Security**
- CodeQL: Weekly security scans + analysis on push/PR
- Dependency Review: Blocks PRs with high-severity vulns

**Deployment**
- Cloudflare Pages preview deployments for PRs
- Automatic preview URL comments on PRs

These workflows ensure:
✓ Type safety across all branches
✓ Test coverage tracking
✓ Security vulnerability detection
✓ Safe dependency updates
✓ Easy preview deployments

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

Cloudflare Pages already handles automatic deployments via
GitHub integration. The deploy-preview.yml workflow is
unnecessary and would duplicate existing functionality.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

**Frontend Fixes:**
- Create ExtendedUser type for Better Auth avatar_url field
- Fix ProfilePage and SettingsPage avatar_url access
- Prefix unused variables: \_navigate, \_currentSessionId

**Worker Fixes:**
- Add @types/node for Buffer type
- Add Env type imports to cron and lib files
- Fix R2 put options: contentType → httpMetadata.contentType
- Prefix unused imports: \_Image, \_vi
- Fix stats.ts return types with explicit generics
- Prefix all unused test parameters with underscore
- Fix wrapped.test.ts month type and r2_key access
- Add missing Env properties: BETTER_AUTH_URL, BETTER_AUTH_SECRET,
  INVIDIOUS_BASE_URL, YOUTUBE_API_KEY

**Remaining Issues (32 errors):**
- Env type conflicts between wrangler-generated and worker/types.ts
- node-vibrant default export issue
- Route handler type mismatches in worker/index.ts

These require deeper wrangler configuration investigation.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

New Features:
- Profile system with listening stats, heatmaps, and weekday patterns
- Badge system with 20 achievements for listening milestones
- Activity feed showing badges earned and listening history
- Wrapped feature with annual and monthly analytics
- Skeleton loaders throughout the app
- Artist profile images stored on R2 with multi-size generation
- Session tracking for listening history

Improvements:
- Redesigned What's New popout to match app design system
- What's New popout now opens from profile dropdown (removed dedicated page)
- All popouts can be dismissed by clicking outside
- GitHub Actions for automated TypeScript checks, tests, and security scans
- Avatar images generated in multiple sizes for better performance

Fixes:
- Resolved all 66 TypeScript errors across the codebase
- Fixed album color extraction (node-vibrant v4 compatibility)
- Fixed Cloudflare Workers environment type conflicts
- Profile stats API now validates Better Auth user IDs correctly
- Avatar URLs persist properly in Better Auth sessions
- Toast notifications are readable on dark backgrounds

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

…ntain permissions'

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
Signed-off-by: Tomás Palma <tomas@tomasps.com>

…racter sanitization'

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
Signed-off-by: Tomás Palma <tomas@tomasps.com>